<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>首页</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../css/public.css" rel="stylesheet" />
		<link href="../css/style.css" rel="stylesheet" />
		<link href="../css/swiper.min.css" rel="stylesheet" />
		<style>
			
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav home_header" >
			<a href="#" class="logo"><img src="../images/logo.png"/></a>
			<a href="#search" class="header_search">
				<i class="mui-icon mui-icon-search"></i>
				<span>吃/住/行/游/购/娱</span>
			</a>
		</header>
		<div class="mui-content home">
			<!-- Swiper -->
			<div class="swiper-container" id="home_banner">
				<div class="cutoffline1">
					<img src="../images/cutoffline1.png"/>
				</div>
			    <div class="swiper-wrapper">
			      <div class="swiper-slide"><a href="#"><img src="../images/banner.jpg"/></a></div>
			      <div class="swiper-slide"><a href="#"><img src="../images/banner.jpg"/></a></div>
			      <div class="swiper-slide"><a href="#"><img src="../images/banner.jpg"/></a></div>
			    </div>
			    <!-- Add Pagination -->
			    <div class="swiper-pagination"></div>
		    </div>
			<!-- Swiper -->
			<div class="swiper-container" id="home_menu">
				<div class="cutoffline1">
					<img src="../images/cutoffline2.png"/>
				</div>
			    <div class="swiper-wrapper">
			      <div class="swiper-slide">
			      	 <a href="about.html">
			      	 	<img src="../images/icon_m1.png"/>
			      	 	<span>概况</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m2.png"/>
			      	 	<span>景区</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m3.png"/>
			      	 	<span>美宿</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m4.png"/>
			      	 	<span>线路</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m5.png"/>
			      	 	<span>活动</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m6.png"/>
			      	 	<span>美食</span>
			      	 </a>
			      </div>
			      <div class="swiper-slide">
			      	 <a href="#">
			      	 	<img src="../images/icon_m7.png"/>
			      	 	<span>民俗</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m8.png"/>
			      	 	<span>厕所</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m9.png"/>
			      	 	<span>康养</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m10.png"/>
			      	 	<span>购物</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m11.png"/>
			      	 	<span>游记</span>
			      	 </a>
			      	 <a href="#">
			      	 	<img src="../images/icon_m12.png"/>
			      	 	<span>便民</span>
			      	 </a>
			      </div>
			    </div>
			    <!-- Add Pagination -->
			    <div class="swiper-pagination"></div>
		    </div>
		    <div class="home_tit">
		    	<img src="../images/icon_tj.png"/>
		    	<h3>玩转日照</h3>
		    </div>
		    <div class="home_box1">
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    </div>
		    <div class="home_tit1">
		    	<h3>体育旅游线路</h3>
		    </div>
		    <div class="home_box1">
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    	<a href="#">
		    		<img src="../img/p1.jpg"/>
		    		<p>日照第三海水浴场</p>
		    	</a>
		    </div>
		</div>
		<nav class="mui-bar mui-bar-tab footbar">
			<a class="mui-tab-item mui-active" href="#tabbar">
				<span class="mui-icon iconfont icon-shouye"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-chat">
				<span class="mui-icon iconfont icon-diqu2"></span>
				<span class="mui-tab-label">区县</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-chat">
				<span class="mui-icon iconfont icon-daohang"></span>
				<span class="mui-tab-label">导航</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-contact">
				<span class="mui-icon iconfont icon-liuyan"></span>
				<span class="mui-tab-label">留言</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-map">
				<span class="mui-icon iconfont icon-bianminfuwu"></span>
				<span class="mui-tab-label">便民</span>
			</a>
		</nav>
		<script src="../js/mui.min.js"></script>
		<script src="../js/swiper.min.js"></script>
		<script>
			
			mui.init({
				
			});
			
			//banner
			var swiper1 = new Swiper('#home_banner', {
		      slidesPerView: 1,
		      loop: true,
		      pagination: {
		        el: '.swiper-pagination',
		        clickable: true,
		      },
		    });
		    
		  	//menu
			var swiper2 = new Swiper('#home_menu', {
		      slidesPerView: 1,
		      loop: true,
		      pagination: {
		        el: '.swiper-pagination',
		        clickable: true,
		      },
		    });
		  	
			var aniShow = "pop-in";
			var isInTransition = false;
			var _self;
			
			//初始化，并预加载webview模式的选项卡			
			function preload() {
				
			}
			mui.plusReady(function() {
				
			});
			

			var _toast = false;

			mui.back = function() {
				if(!_toast || !_toast.isVisible()) {
					_toast = mui.toast('再按一次返回键退出<br>点此可&nbsp;<span style="border-bottom:1px solid #fff" onclick="openFeedback();">反馈意见</span>', {
						duration: 'long',
						type: 'div'
					});
				} else {
					plus.runtime.quit();
				}
			}
			
		</script>
	
	</body>

</html>